<%--%----%>
<%--Created by IntelliJ IDEA.--%>
<%--User: jiangzhenzhen--%>
<%--Date: 2018/7/18--%>
<%--Time: 15:18--%>
<%--To change this template use File | Settings | File Templates.--%>
<%--&ndash;%&gt;--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/component/common.jsp" %>

<html>
<head>
    <title>失智档案--MMSE记录</title>
    <%--<%@ include file="/WEB-INF/jsp/component/commonBottom.jsp" %>--%>
    <script src="${assets}/js/views/vue.min.js"></script>
    <link rel="stylesheet" href="${frames}/css/lib/bootstrap.min.css" type="text/css">
    <%--<link rel="stylesheet" href="${frames}/css/lib/dataTables.bootstrap.css" type="text/css">--%>
    <%@ include file="/WEB-INF/jsp/component/commonBottom.jsp" %>
    <script type="text/javascript" src="${assets}/js/echarts.js"></script>
    <link rel="stylesheet" href="${frames}/css/paginate.css" type="text/css">
    <script src="${js}/jquery-1.9.1.min.js"></script>
    <link href="${assets}/css/bootstrap-datetimepicker.css" type="text/css">
    <script src="${assets}/js/bootstrap-datetimepicker.min.js"></script>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="${assets}/css/bootstrapDatepickr-1.0.0.css">
    <script src="${assets}/js/bootstrapDatepickr-1.0.0.min.js"></script>
    <%--<link rel="stylesheet" href="${frames}/css/lib/dataTables.bootstrap.css" type="text/css">--%>
    <%--<link rel="stylesheet" href="${frames}/css/paginate.css" type="text/css">--%>
    <%--<link rel="stylesheet" href="${newframe}/css/base/base.css" type="text/css">--%>
    <%--<link rel="stylesheet" href="${frames}/css/table.css" type="text/css">--%>
    <link rel="stylesheet" href="${frames}/css/qulitity.css" type="text/css">
    <%--<link rel="stylesheet" href="../assets/css/views/modules/_common.scss">--%>
    <%--<link rel="stylesheet" href="${frames}/css/qulitity.css" type="text/css" type="text/css">--%>
    <%--<script src="${assets}/js/views/bpAbnormal.js"></script>--%>
    <link rel="stylesheet" href="${assets}/css/views/modules/_common.scss">
    <link rel="stylesheet" href="${assets}/css/views/archives/pArchives.css">
    <link rel="stylesheet" href="${assets}/css/views/department/departmentMgr.css">
    <script src="${frames}/Chronic/laydate/laydate.js"></script>
    <script src="${js}/jquery.dataTables.js"></script>
    <style>
        #tablepart5 .dataTables_paginate .current,
        #table3 .dataTables_paginate .active {
            color: #35acfd;
            cursor: default;
            background-color: #ffffff;
            border: none;
        }

        #tablepart5 .dataTables_paginate a,
        #table3 .dataTables_paginate a {
            display: inline-block;
            width: 24px;
            height: 24px;
            border: none;
            color: #333333;
            text-align: center;
        }

        #tablepart5 .pagination .active a,
        #table3 .pagination .active a {
            color: #35acfd;
            cursor: default;
            background-color: #ffffff;
            border: none;
        }

        #bpillness span {
            margin-top: 0 !important;
        }

        .feritin input {
            /*width:20px;*/
            /*height:20px;*/
            vertical-align: middle;
            margin-bottom: 7px;
            display: inline-block !important;
        }

        /*各种历史，默认隐藏*/
        .personHistory {
            display:none;
        }
        #illnessTable tr td{
            border:#ccc solid 1px;
            padding: 5px 10px;
            color:#666666;
        }
        #illnessTable tr td:first-child{
            width:22%;
        }
    </style>
</head>
<body>
<div>
    <%@ include file="../../breadline.jsp" %>
</div>
<div id="main">
    <%--    病人基本信息模块开始--%>
    <div style="padding-bottom:20px;background-color: #ffffff;box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.05);">
        <div style="margin-left:19px;">
            <div class="first_news">
                <div class="news" style="margin-top:15px;margin-bottom:16px;">
                    <h3>病人基本信息</h3>
                    <button type="button" class="btn btn-info" @click="updateInfo()" >
                        <img src="${assets}/images/revise.png" alt="" style="width:16px;vertical-align: middle;">  修改
                    </button>
                    <%--                    <button :disabled="dis" id="btnText" v-if="synchronous" type="button" class="btn btn-info" @click="Synchronous($event)">{{btnText}}</button>--%>
                </div>
                <div style="display: flex;">
                    <div class="img" style="width:12%;">
                        <img src="${assets}/images/img1.png" alt="头像">
                    </div>
                    <div class="infor" style="width:80%;margin-left:2%;">
                        <div>
                            <span style="width:17%;">姓名: &nbsp;{{infor.realname}}</span>
                            <span style="width:15%;">性别: &nbsp;{{infor.sex}}</span>
                            <span style="width:15%;">年龄: &nbsp;{{infor.age}}</span>
                            <span style="width:22%;">出生日期: &nbsp;{{infor.birthday}}</span>
                            <span>身份证号: &nbsp;{{infor.idcard}}</span>
                        </div>
                        <div>
                            <span style="width:17%;">身高: &nbsp;{{infor.height}}cm</span>
                            <span style="width:15%;">体重: &nbsp;{{infor.weight}}kg</span>
                            <span style="width:15%;">BMI: &nbsp;{{infor.bMI}}</span>
                            <span style="width:22%;">腰围: &nbsp;{{infor.waist}}cm</span>
                            <span style="width:24%;">联系电话: &nbsp;{{infor.phone}}</span>
                        </div>
                        <div class="other">
                            <span style="width:30%;margin-right:0;vertical-align:middle">地址: &nbsp;{{infor.homeaddress}}</span>
                            <span style="width:33%;margin-right:0;vertical-align:middle">现患疾病诊断信息: &nbsp;{{infor.diseaseDiagnosis}}</span>
                            <span class="type" style="width:20%;margin-left:5%;vertical-align:middle;">
                                <p :title="infor.diseasesType" style="overflow: hidden;-webkit-line-clamp: 1;display: -webkit-box;-webkit-box-orient: vertical;">疾病类型: &nbsp;{{infor.diseaseName}}</p>
                            </span>
                        </div>
                        <div class="type" style="margin-top:13px;">
                            <b style="margin-right:5%;font-weight: 100;">建档医生: &nbsp;{{infor.doctor}}</b>
                            <b style="font-weight: 100;margin-right:5%;">建档机构: &nbsp;{{infor.hospName}}</b>
                            <b style="font-weight: 100;">备注: &nbsp;{{infor.remark}}<br/></b>
                            <b style="font-weight: 100;" id="bgRemark"></b>
                            <b style="font-weight: 100;" id="bpRemark"></b>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <%--    病人基本信息模块结束--%>
    <%--    诊疗信息开始--%>
    <div class="illness" style="width:99%; margin-right:19px;">
        <div class="tableWrap" style="padding-bottom:20px;background-color: #ffffff;box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.05);">
            <div style="margin-left:20px;">
                <h3 style="margin-bottom:16px;font-size:20px;">诊疗信息</h3>
                <button type="button" class="btn btn-info" @click="saveMMSE()">
                    <img src="${assets}/images/revise.png" alt="" style="width:16px;vertical-align: middle;">  保存
                </button>
            </div>
            <div style="margin-left:19px;">
                <div class="way">
                    <span style="width:5px;padding-bottom:25px;background-color:#35acfd;display:inline-block;vertical-align:middle;margin-right:10px;"></span>
                    <span class="title">MMSE记录</span>
                    <div class="way_content">
                        <div style="margin-bottom:0px;">
                            <label for="">MMSE记录日期：</label>
                            <div class="input-group date form_date" data-date-format="yyyy-mm-dd" style="display:inline-block !important;width:15%;">
                                <input id="beginDate" type="text" class="lay-date" v-model="reportCardData.answerTime" readonly style="width:100% !important;">
                            </div>
                        </div>
                    </div>
                    <div class="way">
                        <span style="width:5px;padding-bottom:25px;background-color:#35acfd;display:inline-block;vertical-align:middle;margin-right:10px;"></span>
                        <span class="title">主诉临床表现</span>
                        <div class="way_content">
                            <div class="feritin fadeContainer">
                                <div class="question" style="height:80px;">
                                    <input type="radio" value="0" @change="getRadioVal" name="yearRadio" style="margin:3px 30px !important;float:left;" v-model="reportCardData.clinicalFeature">
                                    <label style="float:left;">
                                        <p style="line-height:26px;">1、轻度：记忆障碍</p>
                                        <p style="line-height:26px;margin-left: 74px;">视空间障碍(外出后找不到回家的路)</p>
                                        <p style="line-height:26px;margin-left: 74px;">人格障碍(如不爱清洁、不修边幅、暴躁、易怒、自私多疑)</p>
                                    </label>
                                </div>
                                <div class="question" style="height:190px;">
                                    <input type="radio" value="1" @change="getRadioVal" name="yearRadio" style="margin:6px 30px !important;float:left;" v-model="reportCardData.clinicalFeature">
                                    <label style="margin-top:5px;float:left;">
                                        <p style="line-height:26px;">2、中度：上述症状持续加重</p>
                                        <p style="margin-left:74px;line-height:26px;">工作学习新知识能力下降</p>
                                        <p style="margin-left:74px;line-height:26px;">社会接触能力减弱</p>
                                        <p style="margin-left:74px;line-height:26px;">原已掌握的知识和技巧出现明显衰退</p>
                                        <p style="margin-left:74px;line-height:26px;">失语、失用、失认</p>
                                        <p style="margin-left:74px;line-height:26px;">行为和精神异常(性格改变)</p>
                                    </label>
                                </div>
                                <div class="question" style="height:220px;">
                                    <input type="radio" value="2" @change="getRadioVal" name="yearRadio" style="margin:6px 30px !important;float:left;" v-model="reportCardData.clinicalFeature">
                                    <label style="margin-top:5px;float:left;">
                                        <p style="line-height:26px;">3、重度：上述症状持续加重</p>
                                        <p style="margin-left:74px;line-height:26px;">情感淡漠、哭笑无常</p>
                                        <p style="margin-left:74px;line-height:26px;">言语能力丧失</p>
                                        <p style="margin-left:74px;line-height:26px;">不能完成简单的日常生活事项</p>
                                        <p style="margin-left:74px;line-height:26px;">终日无语我床</p>
                                        <p style="margin-left:74px;line-height:26px;">四肢强直或屈曲瘫痪</p>
                                        <p style="margin-left:74px;line-height:26px;">并发症(如肺部及尿路感染、压疮、全省性衰竭等)</p>
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="way">
                        <span style="width:5px;padding-bottom:25px;background-color:#35acfd;display:inline-block;vertical-align:middle;margin-right:10px;"></span>
                        <span class="title">危险因素</span>
                        <div class="way_content">
                            <div class="feritin fadeContainer" style="margin-top:0px;margin-bottom:0px;">
                                <div style="width:100%;overflow:hidden;">
                                    <div style="display:inline-block;width:95%;margin-bottom:0px;vertical-align:top;">
                                    <span class="ill1" v-for="(item,key) in dangerous" :key="key">
                                        <input type="checkbox" :name="item.checkName" :checked="item.check"
                                               :value="item.id" :id="item.forId" v-model="reportCardData.riskFactors"/>
                                        <label :for="item.forId">{{item.name}}</label>
                                    </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="way">
                        <span style="width:5px;padding-bottom:25px;background-color:#35acfd;display:inline-block;vertical-align:middle;margin-right:10px;"></span>
                        <span class="title">家族史</span>
                        <div class="way_content">
                            <div class="feritin fadeContainer" style="margin-top:0px;margin-bottom:0px;">
                                <div style="width:100%;overflow:hidden;">
                                    <div style="display:inline-block;width:95%;margin-bottom:0px;vertical-align:top;">
                                        <span class="ill1" v-for="(item,key) in family" :key="key">
                                            <input type="checkbox" :name="item.checkName" :checked="item.check"
                                                   :value="item.id" :id="item.forId" v-model="reportCardData.familyHistory"/>
                                            <label :for="item.forId">{{item.name}}</label>
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="result way">
                <span style="width:5px;padding-bottom:25px;background-color:#35acfd;display:inline-block;vertical-align:middle;margin-right:10px;"></span>
                <span class="title">量表评估结果</span>

                <div class="ramark" style="width:90%;margin:0 auto;height:60px;">
                    <h3>注：文盲>=17分;小学>=20分；初中及以上>=24分为正常</h3>
                    <div class="scoreResult">
                        <div class="score" style="width:30%;float:left;height:45px;padding:5px 0;">
                            <h3 style="float:left;">分数：</h3>
                            <input v-model="reportCardData.evaluateScore" style="font-size:18px;font-weight:600;border:none;border-bottom:#ccc solid 1px;width:60px;line-height:36px;"/>
                        </div>
                        <div class="score" style="width:30%;float:left;height:45px;padding:5px 0;">
                            <h3 style="float:left;">结果：</h3>
                            <input v-model="reportCardData.evaluateResult" style="font-size:18px;font-weight:600;border:none;border-bottom:#ccc solid 1px;width:60px;line-height:36px;"/>
                        </div>
                        <div class="result" style="width:30%;float:left;height:45px;padding:5px 0;">
                            <h3 style="float:left;">诊断：</h3>
                            <input v-model="reportCardData.diagnosisResult" style="font-size:16px;font-weight:600;border:none;border-bottom:#ccc solid 1px;width:60px;line-height:36px;"/>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <%--    诊疗信息结束--%>
</div>

<script>
  var vm = new Vue({
    el: "#main",
    data:{
      id:'',
      idcard:'',
      TotalScore:'',
      // 家族史
      family:[
        {
          name:'父亲',
          id:'0',
          forId:'family0',
          checkName:'family',
          checked:false
        },
        {
          name:'母亲',
          id:'1',
          forId:'family1',
          checkName:'family',
          checked:false
        },
        {
          name:'外公',
          id:'2',
          forId:'family2',
          checkName:'family',
          checked:false
        },
        {
          name:'外婆',
          id:'3',
          forId:'family3',
          checkName:'family',
          checked:false
        },
        {
          name:'爷爷',
          id:'4',
          forId:'family4',
          checkName:'family',
          checked:false
        },
        {
          name:'奶奶',
          id:'5',
          forId:'family5',
          checkName:'family',
          checked:false
        },
        {
          name:'兄弟姐妹',
          id:'6',
          forId:'family6',
          checkName:'family',
          checked:false
        },
        {
          name:'其他',
          id:'7',
          forId:'family7',
          checkName:'family',
          checked:false
        }
      ],
      // 手术史
      dangerous:[
        {
          name: '低教育程度',
          id: '0',
          forId: 'ysxjb1',
          checkName: 'dangerous',
          checked: false
        },
        {
          name: '膳食因素',
          id: '1',
          forId: 'ysxjb2',
          checkName: 'dangerous',
          checked: false
        },
        {
          name: '吸烟',
          id: '2',
          forId: 'ysxjb3',
          checkName: 'dangerous',
          checked: false
        },
        {
          name: '女性雌激素水平降低',
          id: '3',
          forId: 'ysxjb4',
          checkName: 'dangerous',
          checked: false
        },
        {
          name: '高血糖',
          id: '4',
          forId: 'ysxjb5',
          checkName: 'dangerous',
          checked: false
        },
        {
          name: '高胆固醇',
          id: '5',
          forId: 'ysxjb6',
          checkName: 'dangerous',
          checked: false
        },
        {
          name: '高同型半胱氨酸',
          id: '6',
          forId: 'ysxjb7',
          checkName: 'dangerous',
          checked: false
        },
        {
          name: '血管病因素',
          id: '7',
          forId: 'ysxjb8',
          checkName: 'dangerous',
          checked: false
        }
      ],
      infor:{},
      reportCardData:{
        id:'',
        idCard:'',
        answerTime:'',    //答题时间
        clinicalFeature:'',  //临床表现
        riskFactors:[],      //危险因素
        familyHistory:[],    //家族史
        evaluateScore:'',           //评估分数
        evaluateResult:'',          //评估结果
        diagnosisResult:''          //诊断结果
      },
      question:{}
    },
    methods:{
      getPersonalInfo(){
        let that = this;
        // 获取病人信息
        $.ajax({
          url: "${URL_PATIENT_PATIENTINFO}",
          type: 'post',
          dataType: "json",
          data: {
            idCard: that.idcard
          },
          success: function (data) {
            if(data.success){
              that.infor = data.data;
            }
          }
        })
      },
      initLayDate(id) {
        laydate({
          elem: id,
          istime: true,
          format: 'YYYY-MM-DD',
          choose: function (dates) { //选择好日期的回调
            // initTablePatient();
          }
        })
      },
      // 新增MMSE记录、修改MMSE记录
      saveMMSE(){
        var that = this;
        var url = '';
        that.reportCardData.idCard= that.idcard;
        that.reportCardData.answerTime = $('#beginDate').val();
        if(that.id == ''){
          url = '${ctx}/lose/wisdom/report/card/save';
        }else{
          that.reportCardData.id = that.id;
          url = '${ctx}/lose/wisdom/report/card/update';
        }
        if(that.reportCardData.familyHistory.length == 0){
          that.reportCardData.familyHistory = '';
        }
        if(that.reportCardData.riskFactors.length == 0){
          that.reportCardData.riskFactors = '';
        }
        $.ajax({
          url:url,
          contentType:'application/x-www-form-urlencoded',
          traditional:true,
          data: that.reportCardData,
          dataType:'json',
          type:'post',
          success:function(data){
            $.ajax({
              url:"${URL_SCREENING_GETBREADLINE}",
              dataType:'json',
              type:'post',
              success:function(data){
                var urlLib = '';
                urlLib = JSON.parse(data.data).slice(0,urlLib.length-1);

                $.ajax({
                  url:'${URL_SCREENING_SAVEBREADLINE}',
                  data:{
                    breadLine:JSON.stringify(urlLib)
                  },
                  dataType:'json',
                  type:'post',
                  success:function(data){
                    parent.showSrc(urlLib[urlLib.length-1].href);
                    // 刷新当前页面
                    window.parent.simpleCloseModal();
                  }
                })
              }
            })
          }
        })
      },
      // 修改病人基本信息
      updateInfo: function () {
        let that = this;
        var add = location.search.split('?')[1].split('&')
        var type = location.search.split('?')[1].split('&')[add.length - 1].split('=')[1];

        window.parent.showNewModelIframe("${ctx}/pppatientbase/new/update?id=" + that.infor.id + '&diseasesType=' + type + '&type=' + that.Type, 800, 650);
      },
      getRadioVal() {
        let sum = 0;
        this.reportCardData.diagnosisResult = this.reportCardData.clinicalFeature;
        const {answerTime,nowadaysSeason,nowadaysDay} = this.reportCardData;
      },
      // 回显MMSE的内容
      show:function(id){
        var that = this;
        $.ajax({
          url:'${ctx}/lose/wisdom/report/card/detail',
          // contentType:'application/json;charset=utf-8',
          contentType:'application/x-www-form-urlencoded',
          data: {
            id:id
          },
          dataType:'json',
          type:'post',
          success:function(res){
            const {answerTime,clinicalFeature,riskFactors,familyHistory,evaluateScore,evaluateResult,diagnosisResult} = res.data;
            that.reportCardData = {answerTime,clinicalFeature,riskFactors,familyHistory,evaluateScore,evaluateResult,diagnosisResult};

            if(that.reportCardData.riskFactors.length > 0){
              that.reportCardData.riskFactors = that.reportCardData.riskFactors.split(',');
            }else{
              that.reportCardData.riskFactors = [];
            }
            if(that.reportCardData.familyHistory.length > 0){
              that.reportCardData.familyHistory = that.reportCardData.familyHistory.split(',');
            }else{
              that.reportCardData.familyHistory = [];
            }

          }
        })
      },
      // 获取地址里的参数
      getParams(name){
        name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
        var regexS = "[\\?&]"+name+"=([^&#]*)";
        var regex = new RegExp( regexS );
        var results = regex.exec( window.location.href );
        if( results == null )
          return "";
        else
          return results[1];
      },
      // 当前日期
      getNowFormatDate() {
        var date = new Date();
        var seperator1 = "-";
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
          month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
          strDate = "0" + strDate;
        }
        var currentdate = year + seperator1 + month + seperator1 + strDate;
        return currentdate;
      },
    },
    mounted(){
      this.idcard = this.getParams("idCard");
      this.id = this.getParams('id');
      this.getPersonalInfo(this.idcard);
      this.initLayDate('#beginDate');
      // 获取用药数据
      var date = this.getNowFormatDate();
      this.reportCardData.answerTime = date;
      if(this.id != ''){
        this.show(this.id);
      }
    }
  })


</script>
</body>
</html>